
<script lang="ts">
// <script>标签中写组件相关的JS或TS代码
import Person from './components/Person.vue'
export default {
  // 对外默认输出名称为App的组件
  name:'App',
  // 将Person组件注册到App根组件中
  components:{Person}
}
</script>

<template>
<!--  <template>标签中写组件的html结构-->
  <div class="app">
    <h1>Hello Vue3</h1>
<!--    Vue3中可以出现多个根标签-->
    <Person/>
    <Person/>
  </div>

</template>

<style scoped>
/*<style>标签中写组件的样式*/
.app{
  background-color: aquamarine;
  box-shadow: 0 0 10px;
  border-radius: 10px;
  padding: 20px;
}
</style>
